﻿@{
    string viewModelName = "rafikiVM";
   

}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
    <link rel="stylesheet" href="~/Content/kendo/bootstrap.min.css">
    <link rel="stylesheet" href="~/Content/kendo/2014.3.1119/kendo.common.min.css">
    <link rel="stylesheet" href="~/Content/kendo/2014.3.1119/kendo.rtl.min.css">
    <link rel="stylesheet" href="~/Content/kendo/2014.3.1119/kendo.bootstrap.min.css">
    <link rel="stylesheet" href="~/Content/kendo.custom.css">
    <script src="~/Scripts/jquery-2.1.1.min.js"></script>
    <script src="~/Scripts/kendo/2014.3.1119/kendo.ui.core.min.js"></script>
    <link rel="stylesheet" href="~/Content/JonStyle.css">
</head>
<body>
    <div>
    <h1>Test Rafiki Page</h1>
        <p>@viewModelName</p>
        <p data-bind="text: userName"></p>
    </div>
    <script>
    $(document).ready(function () {
        var crudServiceBaseUrl = "https://localhost:44301" + "/api/";
        @(viewModelName) = kendo.observable({
            userID: @Session["AuthUserPersonID"],
            userEntityID: '',
            userName: '',
            userDataSource:  new kendo.data.DataSource({
                transport: {
                    read: {
                        url: '',
                        dataType: "json"
                    }
                },
                change: function() {
                    @(viewModelName).set("userEntityID",@(viewModelName).userDataSource.at(0).EntityID);
                    @(viewModelName).set("userName",@(viewModelName).userDataSource.at(0).FullName);
                }
            })
        });

        kendo.bind($("body"),@(viewModelName));

    @(viewModelName).userDataSource.transport.options.read.url=crudServiceBaseUrl + 'sqlsp/getRafikiView?viewName=PersonfromFriendlyID&P1='+@(viewModelName).userID;
    @(viewModelName).userDataSource.read();

    });

</script>
</body>
</html>
